<template>
  <div>
    <echart :chartData="barChartData" style="height: 240px" ref="aa"></echart>

    <barechart :chartData="barChartData2" />
    <lineechart :chartData="lineeChartData2" />
  </div>
</template>

<script>
import echart from "../../components/ECharts.vue";
import barechart from "../../components/barecharts.vue";
import lineechart from "../../components/lineecharts.vue";

export default {
  props: {},
  components: {
    echart,
    barechart,
    lineechart,
  },
  data() {
    return {
      barChartData: {
        xData: [1, 2, 3, 4, 5, 6, 7],
        series: [
          {
            data: [150, 230, 224, 218, 135, 147, 260],
            type: "bar",
          },
        ],
      },
      barChartData2: {
        days: ["11.21", "11.22", "11.23", "11.24", "11.25", "11.26", "11.27"],
        data1: [100, 120, 161, 134, 105, 160, 165],
        data2: [120, 82, 91, 154, 162, 140, 145],
        data3: [200, 220, 261, 234, 205, 260, 265],
      },
      lineeChartData2:{
        XData: ["11.21", "11.22", "11.23", "11.24", "11.25", "11.26", "11.27"],
        data1: [100, 120, 161, 134, 105, 160, 165],
        data2: [120, 82, 91, 154, 162, 140, 145],
        data3: [220, 282, 291, 254, 262, 240, 245],
      }
    };
  },
  methods: {},
  mounted() {
    this.$refs.aa.initChart("aa");
  },
};
</script>

<style lang="scss">
</style>